<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8" />
    <title>Customer Registration Form</title>
    <style>
        .error {
            color: red;
        }
    </style>
</head>
<body>
<i>Fill out the form</i>

<br /><br />

<form
        th:action="@{/processForm1}"
        th:object="${customer}"
        method="post"
        autocomplete="off"
>
    <label>
        First Name:
        <input type="text" th:field="*{firstName}" />
    </label>
    <br /><br />
    <label>
        Last Name (*):
        <input type="text" th:field="*{lastName}" />
    </label>

    <!--  add error message (if present)  -->
    <span
            th:if="${#fields.hasErrors('lastName')}"
            th:errors="*{lastName}"
            class="error"
    ></span>

    <br /><br />

    <label>
        Free passes:
        <input type="text" th:field="*{freePasses}" />
    </label>

    <!--  add error message (if present)  -->
    <span
            th:if="${#fields.hasErrors('freePasses')}"
            th:errors="*{freePasses}"
            class="error"
    ></span>

    <br /><br />


    <label>
        Postal Code
        <input type="text" th:field="*{postalCode}" />
    </label>

    <!--  add error message (if present)  -->
    <span
            th:if="${#fields.hasErrors('postalCode')}"
            th:errors="*{postalCode}"
            class="error"
    ></span>


    <input type="submit" value="Submit" />
</form>

<script src="http://localhost:35729/livereload.js"></script>
</body>
</html>
